<template>
  <div class="New_build">
    <div class="mask"></div>
    <div class="new_build">
      <div class="build-top">
        <p>改单（仓库盘差）</p>
        <i class="el-icon-close" @click="closeChange"></i>
      </div>

      <div class="build-info">
        <div class="build-info-1">
          <p>盘点日期</p>
          <el-date-picker :disabled="Dis" v-model="differTime" type="date">
          </el-date-picker>
          <p>单号</p>
          <el-input
            v-model="receiptsNumber"
            :disabled="Dis"
            class="build-inp"
          ></el-input>
          <p>盘差数量</p>
          <el-input
            v-model="differNumber"
            :disabled="Disa"
            class="build-inp"
          ></el-input>

          <p>仓库编号</p>
          <el-input v-model="warehouseNo" disabled></el-input>
        </div>
        <div class="build-info2">
          <p>售价</p>
          <el-input
            v-model="sellingPrice"
            disabled
            class="build-inp"
          ></el-input>
          <p>盘点序号</p>
          <el-input v-model="sequence" disabled class="build-inp"></el-input>
          <p>仓库</p>
          <el-input
            v-model="warehouseName"
            disabled
            class="build-inp"
          ></el-input>
        </div>

        <!-- <div class="barcode">
          <p>条码扫描</p>
          <el-switch
            v-model="isBar"
            active-color="#409EFF"
            inactive-color="#C0C4CC">
          </el-switch>
        </div> -->

        <div class="enterBarcode">
          <el-input
            v-model="kindsNumber"
            disabled
            placeholder="扫描/输入条码"
          ></el-input>
        </div>

        <el-table
          height="210px"
          :data="barcodeData"
          style="width: 100%"
          :header-cell-style="{
            background: '#f4f4f4',
            padding: 0,
            height: '40px'
          }"
          :cell-style="{ padding: 0, height: '36px' }"
        >
          <el-table-column prop="sequence" label="仓库盘点序号" width="150px">
          </el-table-column>
          <el-table-column prop="warehouseNo" label="仓库编号">
          </el-table-column>
          <el-table-column prop="receiptsNumber" label="单号">
          </el-table-column>
          <el-table-column prop="kindsNumber" label="款号" width="150px">
          </el-table-column>
          <el-table-column prop="differNumber" label="盘差数量">
          </el-table-column>
          <el-table-column prop="sellingPrice" label="售价"> </el-table-column>
          <el-table-column prop="onePrice" label="单价"> </el-table-column>
          <el-table-column prop="differTime" label="盘差日期">
          </el-table-column>
        </el-table>
      </div>

      <div class="build-btn">
        <div style="margin: 5px 20px 0 0">
          <el-button @click="closeChange">取消</el-button>
          <el-button type="primary" plain @click="saveChange">保存</el-button>
          <!-- <el-button type="primary" @click="keepGoing">继续录入</el-button> -->
        </div>
      </div>
    </div>

    <!-- <div class="popup" :style="{display:showPopup}">
      <div class="popup_t">
        <p>输入扫描数量</p>
        <i class="el-icon-close" @click="closePopup"></i>
      </div>
      <div class="popup_c">
        <p>请输入扫描数量</p>
        <p>如果不输入则扫描数量为1</p>
        <input type="text" v-model="one" class="popup_button">
      </div>
      <div class="popup_b">
        <el-button>删除</el-button>
        <el-button @click="preservation" type="primary">确定</el-button>
      </div>
    </div> -->
  </div>
</template>

<script>
import enterUp from '../../../../components/mixins/enterUp'
import {
  kindsNumberOutContinue,
  kindsNumberOut
} from '../../../../network/customerOutTotal'
import { postNewbuild, getWarehouse } from '../../../../network/warehouse'
export default {
  mixins: [enterUp],
  props: {
    detailInfo: {
      type: Object,
      default: {}
    }
  },
  created() {
    console.log(this.detailInfo)
  },
  data() {
    return {
      Dis: false,
      Disa: false,
      one: 1,
      isBar: false,
      kindsNumber: '',
      // showPopup:'none',
      differTime: new Date(),
      receiptsNumber: '',
      differNumber: '',
      warehouseName: '',
      warehouseNo: '',
      sellingPrice: '',
      sequence: '',
      onePrice: '',
      dataSource: '',
      barcodeData: []
    }
  },
  methods: {
    closeChange() {
      this.$emit('closeChange')
    },
    saveChange() {
      let obj = [
        {
          receiptsNumber: this.receiptsNumber,
          differNumber: this.differNumber,
          warehouseNo: this.warehouseNo,
          sellingPrice: this.sellingPrice,
          sequence: this.sequence,
          warehouseName: this.warehouseName,
          onePrice: this.onePrice,
          enteringTime: this.enteringTime,
          differTime:
            this.differTime.getFullYear() +
            '-' +
            (this.differTime.getMonth() + 1) +
            '-' +
            this.differTime.getDate(), //改为标准日期
          kindsNumber: this.kindsNumber,
          dataSource: this.dataSource
        }
      ]
      // postNewbuild(obj).then(res=>{
      //   console.log(res.data)
      // })
      // console.log(obj)
      this.$emit('saveChange', obj)
    }

    // dbclick(row, event, column){
    //   row.isOK =!row.isOK
    // },
    // F7
    // closePopup(){
    //   this.showPopup = 'none'
    // },
  },
  // mounted(){
  //   let _this = this
  //   document.onkeydown = function(event){
  //     let e = event || window.event || arguments.callee.caller.arguments[0]
  //     if(e && e.keyCode==118){ // 按 F7
  //     // console.log("ffffffffff")
  //     if(_this.showPopup == 'none'){
  //       _this.showPopup = 'block';
  //     }else{
  //       _this.showPopup = 'none'
  //     }
  //     }
  //   }
  // },
  watch: {
    receiptsNumber(a, b) {
      if (a) {
        this.receiptsNumber = a.toUpperCase().trim()
      }
    },
    detailInfo(a, b) {
      this.receiptsNumber = a.receiptsNumber
      this.differNumber = a.differNumber
      this.warehouseNo = a.warehouseNo
      this.sellingPrice = a.sellingPrice
      this.sequence = a.sequence
      this.warehouseName = a.warehouseName
      this.enteringTime = a.enteringTime
      this.kindsNumber = a.kindsNumber
      this.dataSource = a.dataSource
      console.log(this.dataSource)
      var ac = [
        {
          receiptsNumber: a.receiptsNumber,
          differNumber: a.differNumber,
          warehouseNo: a.warehouseNo,
          sellingPrice: a.sellingPrice,
          sequence: a.sequence,
          warehouseName: a.warehouseName,
          onePrice: a.onePrice,
          // differTime:a.differTime,
          kindsNumber: a.kindsNumber,
          dataSource: a.dataSource
        }
      ]

      // if(this.dataSource == 0){
      //   this.Disa = true
      //   this.Dis = false
      // };
      // if(this.dataSource == 1){
      //   this.Dis = true
      //   this.Disa = true
      // }

      this.barcodeData = []
      ac.forEach((e) => {
        this.barcodeData.push(e)
      })
    }
  }
}
</script>

<style scoped>
.middle {
  padding: 10px 15px;
}
.middle p {
  padding-bottom: 10px;
}
._top {
  display: flex;
  width: 100%;
  height: 40px;
  padding: 10px 15px;
  justify-content: space-between;
  background: #f8f8f8;
  font-weight: 700;
}
.scanning {
  width: 400px;
  height: 200px;
  background: white;
  box-shadow: 0 3px 3px 3px #e7e4e4;
  position: abbuildlute;
  top: 30%;
  left: 30%;
  z-index: 1000;
}
/* 新建资料 */
.mask {
  position: fixed;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  background-color: #000;
  opacity: 0.3;
  z-index: 9;
}
.new_build {
  position: fixed;
  /* position: relative; */
  top: 20%;
  left: 50%;
  transform: translateX(-50%);
  width: 1070px;
  height: 485px;
  z-index: 99;
  background-color: white;
  overflow: auto;
}
.new_build .build-top {
  height: 40px;
  background-color: #f8f8f8;
  display: flex;
  justify-content: space-between;
  padding: 10px 15px;
}
.build-top p {
  font-weight: 700;
}

.new_build input {
  height: 30px;
  border: buildlid 1px #dcdfe6;
  border-radius: 5px;
  margin-left: 10px;
}
.new_build input:focus {
  outline: none;
  border: buildlid 1px #409eff;
}

.build-info {
  padding: 0 15px;
  padding-bottom: 10px;
  /* border-bottom: buildlid #f2f2f2 2px; */
}
.build-info-1 p {
  display: inline-block;
  width: 80px;
  text-align: right;
  margin-right: 15px;
}

.build-info .barcode p {
  display: inline;
  margin-right: 15px;
}
.build-info .barcode div {
  margin-top: 15px;
}

.barcode-info-1 p,
.barcode-info-2 p {
  display: inline-block;
  width: 96px;
  text-align: right;
  margin-right: 9px;
}
.build-info2 {
  display: flex;
  margin: 10px 0;
}
.build-info2 p {
  display: inline-block;
  width: 80px;
  text-align: right;
  margin-right: 15px;
}

.colorBox,
.infoBox {
  display: inline;
}

.enterBarcode {
  height: 60px;
  background-color: #f2f2f2;
  margin: 15px 0;
}

.build-btn {
  text-align: right;
}
.popup {
  width: 400px;
  height: 200px;
  border: 1px solid #dbdbdb;
  box-shadow: 0 2px 2px 2px #dbdbdb;
  z-index: 999;
  position: absolute;
  left: 50%;
  top: 50%;
  margin: -100px 0 0 -200px;
  background: white;
  /* display: block; */
}
.popup_t {
  display: flex;
  justify-content: space-between;
  width: 100%;
  height: 40px;
  background: rgb(244, 244, 244);
  padding: 8px 15px;
}
.popup_t p {
  font-weight: 700;
}
.popup_c {
  padding: 8px 15px;
}
.popup_button {
  margin: 5px 0 0 0;
  width: 94%;
  height: 30px;
  padding: 0 10px;
  border: 1px solid#dbdbdb;
  border-radius: 3px;
}
.popup_b {
  margin: 10px 0 0 0;
  padding-left: 230px;
}
.build-inp {
  width: 160px;
}
</style>

<style>
.new_build .build-info-4 .el-table .cell {
  box-sizing: border-box;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: normal;
  word-break: break-all;
  line-height: 41px;
  padding-right: 10px;
  height: 40px;
}
.new_build .build-info-4 .el-input__inner {
  border: 0px;
}
.new_build .build-info-4 .el-input__inner:focus {
  border: 1px solid #017aff;
}

/* .new_build .build-info-1 .el-input, .new_build .build-info-3 .el-input{
    width: 425px;
  } */
.new_build .build-info-1 .el-input,
.new_build .build-info-2 .el-input {
  margin-top: 10px;
  width: 160px;
}
.new_build .el-input__inner {
  height: 30px !important;
}
.new_build .el-input__icon {
  line-height: 30px !important;
}
.build-info .barcode .el-switch {
  margin: 0 !important;
}

.new_build .enterBarcode .el-input {
  width: 535px;
  margin: 14px 17px;
}
</style>
